<template>
	<view>
		<view class="" v-if="listData.length > 0">
		<uni-card v-for="(item, key) in listData" :key="key" @click="detail(item.elevatorId,item.elevatorName)" >
		    <view class="title-content">
				<text>{{item.elevatorName}}</text>
		    	<!-- 已完成 right-->
		    	<view class="successAccomplish" v-show="item.isFault == 1">
		    		<image src="../../../static/img/fault/fault_icon.png" mode=""></image>
		    		<view class="">
		    			<!-- <text>{{item.elevatorStatus == 1 ? '故障' :item.elevatorStatus == 2 ? '离线':item.elevatorStatus == 3 ? '困人' : '正常' }}</text> -->
		    			<text>{{item.elevatorStatus}}</text>
		    		</view>
		    	</view>
		    </view>
		</uni-card>
		</view>
		<view class="" v-else>
			<nullPage></nullPage>
		</view>
	</view>
</template>

<script>
	import uniCard from '@/components/uni-card/uni-card.vue'
	
	import nullPage from '@/common/null.vue'
	import polling from "@/serve/api/polling.js";
	export default {
		components: {uniCard , nullPage},
		data() {
			return {
				name:'',
				type:0,
				listData:[
				],
				pageNum:1,
				getListFlag:true,
				communityId:"",
			}
		},
		
		onLoad(e){
			this.name = e.title
			this.type = e.type
			this.communityId = e.id
			uni.setNavigationBarTitle({
				title:e.title,
				})
			
			this.geteleva()
		},
		methods: {
			detail(elevatorId,elevatorName){
				var pages = getCurrentPages();
				var prvePage = pages[pages.length - 3];
				if(this.type == 1){
					// prvePage.$vm.name = elevatorId;
					// #ifdef APP-PLUS
					prvePage.$vm.elevator_name(elevatorId);
					// #endif
					// #ifdef H5
					prvePage.elevator_name(elevatorId);
					// #endif
					
					uni.navigateBack({
						delta:2
					})
					// uni.navigateTo({
					// 	url: '/pages/tabbar/polling/submit/submit?elevatorId=' + elevatorId,
					// })
				}else if(this.type == 2){
					
						prvePage.$vm.elevator_name(elevatorId);
						uni.navigateBack({
							delta:2
						})
					// uni.navigateTo({
					// 	url: '/pages/tabbar/polling/fault/fault?elevatorId=' + elevatorId,
					// })
					
				}else{
					uni.navigateTo({
						// url: './detailsMsg/detailsMsg?elevatorId=${item.elevatorId}&title=${item.elevatorName}',
						url: './detailsMsg/detailsMsg?elevatorId=' + elevatorId + '&title=' + elevatorName
					})
					
				}
			},
			async geteleva(){
				
				let parme = {
					pageNum: this.pageNum,
					pageSize: 10,
					communityId:this.communityId
				}
				const res = await polling.findElevatorInfoByCommunityId(parme)
				if (res.data.data.list.length < 10) {
					this.getListFlag = false;
				}
				this.listData.push(...res.data.data.list)
			}
		
		
		},
		onReachBottom(e) {
			if (this.getListFlag) {
				this.pageNum = this.pageNum + 1;
				this.geteleva();
			}
		
		}
	}
</script>

<style scoped> 
	*{
		margin:0;
		padding: 0;
	}
	page{
		width: 750rpx;
		background: #EFF2F5;
		overflow: hidden;
	}
	view{
		font-size:28rpx;
		line-height:1.8;
		
	}
	.uni-card{
		width: 670rpx;
		/* height: 140rpx; */
		margin: 0 auto;
		background: #FFFFFF;
		box-shadow: 0rpx 10rpx 10rpx 0rpx rgba(52, 54, 61, 0.05);
		border-radius: 16rpx;	
		margin-top: 20rpx;
		border: none;
		outline: none;
		
	}
	.title-content{	
		line-height: 100rpx;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
	}
	
	/* 故障图标样式 */
	/* 已完成 */
	.successAccomplish{
		background-color: #FF5753;
		width: 140rpx;
		height: 56rpx;
		text-align: center;
		box-shadow: 0px 5px 10px 0px rgba(58, 194, 17, 0.2);
		border-radius: 28rpx;
		color: #FFFFFF;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
	}
	.successAccomplish image {
		width: 24rpx;
		height: 24rpx;
		padding-right: 15rpx;
		border-radius: 10rpx;
	
	}
	.successAccomplish text{
		font-size: 24rpx;
		font-weight: 400;
		color: #FFFFFF;
	}
</style>
